<template>
  <div id="recruitlist">
    <el-breadcrumb separator=">">
      <el-breadcrumb-item :to="{ path: '/' }">系统首页</el-breadcrumb-item>
      <!-- <el-breadcrumb-item :to="{ path: '/recruit/main' }">公开招聘</el-breadcrumb-item> -->
      <el-breadcrumb-item >公开招聘</el-breadcrumb-item>
      <el-breadcrumb-item >{{ theYear }}年度</el-breadcrumb-item>
    </el-breadcrumb>
    <section class="wboxs">
    <el-dialog title="导入失败原因" :visible.sync="errorVisible" :close-on-click-modal="false" :close-on-press-escape="false">
      <el-table :data="errorList" highlight-current-row>
        <el-table-column prop="index" label="错误序号" width="120" align="center">
        </el-table-column>
        <el-table-column prop="error" label="原因" min-width="150">
        </el-table-column>
      </el-table>
    </el-dialog>
    <!--工具条-->
        <el-form :inline="true" :model="filters">
          <div>
            <el-form-item label="当前年度">
              <el-select v-model="theYear" @change="getList" style="width:100px;" :loading="yearLoading">
                <!-- <el-option :value="theYear" :label="theYear" /> -->
                <el-option v-for="(item,index) in yearList" :key="'year'+index" :value="item" :label="item" />
              </el-select>
            </el-form-item>
            <el-form-item label="单位名称">
              <el-input v-model="filters.unitName" placeholder="关键字" @change="getList"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="getList" icon="el-icon-search">查询</el-button>
            </el-form-item>
            <div style="float:right">
              <el-form-item>
                <el-button icon="el-icon-setting" type="primary" style="float:right;margin-left:10px" @click="setYear">招聘工作年度设置</el-button>
                <el-upload style="margin:0;float:right;margin-left:10px" class="upload-demo" :before-upload="beforeAvatarUpload" :on-success="getImportList" :on-error="uploadError" name="file" :show-file-list="false"
                  :action="this.$http.defaults.baseURL + this.$http.defaults.recruitAPI + 'api/recruitBusPlanRelease/saveImport?type=2&theYear='+this.theYear" with-credentials accept="vnd.openxmlformats-officedocument.spreadsheetml.sheet">
                  <el-button icon="el-icon-upload2" type="danger" :loading="saveloading">批量导入并覆盖之前下达计划</el-button>
                </el-upload>
                <el-upload style="margin:0;float:right;margin-left:10px" class="upload-demo" :before-upload="beforeAvatarUpload" :on-success="getImportList" :on-error="uploadError" name="file" :show-file-list="false"
                  :action="this.$http.defaults.baseURL + this.$http.defaults.recruitAPI + 'api/recruitBusPlanRelease/saveImport?type=1&theYear='+this.theYear" with-credentials accept="vnd.openxmlformats-officedocument.spreadsheetml.sheet">
                  <el-button icon="el-icon-upload2" type="success" :loading="saveloading">在原下达计划基础上批量追加计划</el-button>
                </el-upload>
                <el-button icon="el-icon-download" type="primary" style="float:right;margin-left:10px" @click="downloadTemplate()">下载计划下达模板</el-button>
                <el-button icon="el-icon-download" type="success" style="float:right;margin-left:10px" @click="exportAll()">导出本年度汇总数据</el-button>
              </el-form-item>
            </div>
          </div>
        </el-form>
    </section>
    <section class="wboxd" style="margin-top:10px">
      <!--列表-->
      <h1>单位列表</h1>
      <el-table :data="selectionlist" highlight-current-row v-loading="listLoading" style="width: 100%;" :height="tableHeight" border id="selectionindexlist" row-key="personId"
        default-expand-all
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
        <el-table-column label="单位" prop="unitName">
          <template slot-scope="scope">
            {{ scope.row.unitName }}
            <el-tooltip class="item"
                :open-delay="600"
                placement="top"
                content="该单位计划申报数据与历年招聘人员信息库不一致"
                v-if="scope.row.flag === 0">
                <el-button type="text" icon="el-icon-warning" />
              </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column label="制定年度公开招聘计划">
          <el-table-column label="计划申报" width="60">
            <template slot-scope="scope">
              <!-- <el-badge style="float:right" v-if="scope.row.planDeclareNew&&scope.row.planDeclareState===1" is-dot class="item"> </el-badge> -->
              <i v-if="!scope.row.stepState.plan_declare||scope.row.stepState.plan_declare.state===0" class="custom icon_c_0" />
              <el-tooltip v-else-if="scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1" :content="scope.row.stepState.plan_declare.submitTime+'提交'" placement="top" :open-delay="600">
                <i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,1)" style="cursor: pointer;" />
              </el-tooltip>
              <el-tooltip v-else-if="scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===5" :content="scope.row.stepState.plan_declare.backTime+'退回，原因：'+scope.row.stepState.plan_declare.remarks" placement="top" :open-delay="600">
                <i :class="'custom icon_c_3'" />
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column label="计划下达" width="60">
            <template slot-scope="scope">
              <i v-if="!scope.row.stepState.plan_release||scope.row.stepState.plan_release.state===0" class="custom icon_c_1" @click="doit(scope.row.unitId,2)" style="cursor: pointer;" />
              <el-tooltip v-else-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1" :content="scope.row.stepState.plan_release.submitTime+'下达'" placement="top" :open-delay="600">
                <i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,2)" style="cursor: pointer;" />
              </el-tooltip>
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="制定年度公开招聘工作方案" width="80" align="center">
          <!-- <el-table-column label="岗位对接方案" width="60" v-if="type!=2"> -->
            <template slot-scope="scope">
              <!-- <el-badge style="float:right" v-if="scope.row.jobDockingNew&&scope.row.jobDockingState===1" is-dot class="item"> </el-badge> -->
              <div v-if="!scope.row.stepState.plan_release||!scope.row.stepState.plan_declare||scope.row.stepState.plan_release.state!==1||scope.row.stepState.plan_declare.state!==1||!scope.row.stepState.post_docking||scope.row.stepState.post_docking.state===0" style="line-height:30px"><i class="custom icon_c_0" /></div>
              <el-tooltip v-else-if="scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1" :content="scope.row.stepState.post_docking.submitTime+'提交'" placement="top" :open-delay="600">
                <i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,3)" style="cursor: pointer;" />
              </el-tooltip>
              <el-tooltip v-else-if="scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===5" :content="scope.row.stepState.post_docking.backTime+'退回，原因：'+scope.row.stepState.post_docking.remarks" placement="top" :open-delay="600">
                <i :class="'custom icon_c_3'" />
              </el-tooltip>
            </template>
          <!-- </el-table-column> -->
        </el-table-column>
        <el-table-column label="发布招聘岗位、资格条件等招聘信息" width="90" align="center">
          <!-- <el-table-column label="招聘公告" width="350"> -->
            <template slot-scope="scope">
              <div v-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1&&scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1&&scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1">
                <div v-if="scope.row.stepState.announcementCount2||scope.row.stepState.announcementCount3" style="line-height:30px"><i :class="'custom icon_c_1'" @click="doit(scope.row.unitId,4)" style="cursor: pointer;" /> {{(scope.row.stepState.announcementCount4?scope.row.stepState.announcementCount4:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="!scope.row.stepState.announcementCount4" style="line-height:30px"><i :class="'custom icon_c_0'"/> {{(scope.row.stepState.announcementCount4?scope.row.stepState.announcementCount4:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="scope.row.stepState.postReserveCount<=scope.row.stepState.announcementCount4" style="line-height:30px"><i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,4)" style="cursor: pointer;" /> {{(scope.row.stepState.announcementCount4?scope.row.stepState.announcementCount4:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else style="line-height:30px"><i :class="'custom icon_c_5'" @click="doit(scope.row.unitId,4)" style="cursor: pointer;" /> {{(scope.row.stepState.announcementCount4?scope.row.stepState.announcementCount4:0)+'/'+scope.row.stepState.postReserveCount}}</div>
              </div>
              <div v-else style="line-height:30px"><i class="custom icon_c_0" /></div>
            </template>
          <!-- </el-table-column> -->
        </el-table-column>
        <el-table-column label="审查应聘人员资格条件" width="90" align="center">
            <template slot-scope="scope">
              <div v-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1&&scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1&&scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1">
                <div v-if="!scope.row.stepState.qualificationCount1" style="line-height:30px"><i :class="'custom icon_c_0'"/> {{(scope.row.stepState.qualificationCount1?scope.row.stepState.qualificationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="scope.row.stepState.postReserveCount<=scope.row.stepState.qualificationCount1" style="line-height:30px"><i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,5)" style="cursor: pointer;" /> {{(scope.row.stepState.qualificationCount1?scope.row.stepState.qualificationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else style="line-height:30px"><i :class="'custom icon_c_5'" @click="doit(scope.row.unitId,5)" style="cursor: pointer;" /> {{(scope.row.stepState.qualificationCount1?scope.row.stepState.qualificationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
              </div>
              <div v-else style="line-height:30px"><i class="custom icon_c_0" /></div>
            </template>
        </el-table-column>
        <el-table-column label="面试">
          <el-table-column label="面试考官备案" width="90" align="center">
            <template slot-scope="scope">
              <div v-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1&&scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1&&scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1">
                <div v-if="!scope.row.stepState.interviewerFilingCount1" style="line-height:30px"><i :class="'custom icon_c_0'"/> {{(scope.row.stepState.interviewerFilingCount1?scope.row.stepState.interviewerFilingCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="scope.row.stepState.postReserveCount<=scope.row.stepState.interviewerFilingCount1" style="line-height:30px"><i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,6)" style="cursor: pointer;" /> {{(scope.row.stepState.interviewerFilingCount1?scope.row.stepState.interviewerFilingCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else style="line-height:30px"><i :class="'custom icon_c_5'" @click="doit(scope.row.unitId,6)" style="cursor: pointer;" /> {{(scope.row.stepState.interviewerFilingCount1?scope.row.stepState.interviewerFilingCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
              </div>
              <div v-else style="line-height:30px"><i class="custom icon_c_0" /></div>
            </template>
          </el-table-column>
          <el-table-column label="面试成绩上传" width="90" align="center">
            <template slot-scope="scope">
              <div v-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1&&scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1&&scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1">
                <div v-if="!scope.row.stepState.interviewerResultsCount1" style="line-height:30px"><i :class="'custom icon_c_0'"/> {{(scope.row.stepState.interviewerResultsCount1?scope.row.stepState.interviewerResultsCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="scope.row.stepState.postReserveCount<=scope.row.stepState.interviewerResultsCount1" style="line-height:30px"><i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,7)" style="cursor: pointer;" /> {{(scope.row.stepState.interviewerResultsCount1?scope.row.stepState.interviewerResultsCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else style="line-height:30px"><i :class="'custom icon_c_5'" @click="doit(scope.row.unitId,7)" style="cursor: pointer;" /> {{(scope.row.stepState.interviewerResultsCount1?scope.row.stepState.interviewerResultsCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
              </div>
              <div v-else style="line-height:30px"><i class="custom icon_c_0" /></div>
            </template>
          </el-table-column>
          <!-- <el-table-column label="考察" width="80" align="center">
            <template slot-scope="scope">
              <div v-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1&&scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1&&scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1">
                <div v-if="!scope.row.stepState.investigateCount1" style="line-height:30px"><i :class="'custom icon_c_0'"/> {{(scope.row.stepState.investigateCount1?scope.row.stepState.investigateCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="scope.row.stepState.postReserveCount<=scope.row.stepState.investigateCount1" style="line-height:30px"><i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,8)" style="cursor: pointer;" /> {{(scope.row.stepState.investigateCount1?scope.row.stepState.investigateCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else style="line-height:30px"><i :class="'custom icon_c_5'" @click="doit(scope.row.unitId,8)" style="cursor: pointer;" /> {{(scope.row.stepState.investigateCount1?scope.row.stepState.investigateCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
              </div>
              <div v-else style="line-height:30px"><i class="custom icon_c_0" /></div>
            </template>
          </el-table-column>
          <el-table-column label="体检" width="80" align="center">
            <template slot-scope="scope">
              <div v-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1&&scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1&&scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1">
                <div v-if="!scope.row.stepState.physicalExaminationCount1" style="line-height:30px"><i :class="'custom icon_c_0'"/> {{(scope.row.stepState.physicalExaminationCount1?scope.row.stepState.physicalExaminationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="scope.row.stepState.postReserveCount<=scope.row.stepState.physicalExaminationCount1" style="line-height:30px"><i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,9)" style="cursor: pointer;" /> {{(scope.row.stepState.physicalExaminationCount1?scope.row.stepState.physicalExaminationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else style="line-height:30px"><i :class="'custom icon_c_5'" @click="doit(scope.row.unitId,9)" style="cursor: pointer;" /> {{(scope.row.stepState.physicalExaminationCount1?scope.row.stepState.physicalExaminationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
              </div>
              <div v-else style="line-height:30px"><i class="custom icon_c_0" /></div>
            </template>
          </el-table-column> -->
        </el-table-column>
        <el-table-column label="择优确定拟聘用人员" width="90" align="center">
          <!-- <el-table-column label="聘用人选备案" width="120"> -->
            <template slot-scope="scope">
              <div v-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1&&scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1&&scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1">
                <div v-if="!scope.row.stepState.candidateRegistrationCount1" style="line-height:30px"><i :class="'custom icon_c_0'"/> {{(scope.row.stepState.candidateRegistrationCount1?scope.row.stepState.candidateRegistrationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="scope.row.stepState.postReserveCount<=scope.row.stepState.candidateRegistrationCount1" style="line-height:30px"><i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,10)" style="cursor: pointer;" /> {{(scope.row.stepState.candidateRegistrationCount1?scope.row.stepState.candidateRegistrationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else style="line-height:30px"><i :class="'custom icon_c_5'" @click="doit(scope.row.unitId,10)" style="cursor: pointer;" /> {{(scope.row.stepState.candidateRegistrationCount1?scope.row.stepState.candidateRegistrationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
              </div>
              <div v-else style="line-height:30px"><i class="custom icon_c_0" /></div>
            </template>
          <!-- </el-table-column> -->
        </el-table-column>
        <el-table-column label="公示拟聘用人员名单" width="90" align="center">
          <!-- <el-table-column label="拟聘人选公示" width="350"> -->
            <template slot-scope="scope">
              <div v-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1&&scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1&&scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1">
                <div v-if="scope.row.stepState.candidateAnnouncementCount2||scope.row.stepState.candidateAnnouncementCount3" style="line-height:30px"><i :class="'custom icon_c_1'" @click="doit(scope.row.unitId,11)" style="cursor: pointer;"/> {{(scope.row.stepState.candidateAnnouncementCount4?scope.row.stepState.candidateAnnouncementCount4:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="!scope.row.stepState.candidateAnnouncementCount4" style="line-height:30px"><i :class="'custom icon_c_0'"/> {{(scope.row.stepState.candidateAnnouncementCount4?scope.row.stepState.candidateAnnouncementCount4:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="scope.row.stepState.postReserveCount<=scope.row.stepState.candidateAnnouncementCount4" style="line-height:30px"><i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,11)" style="cursor: pointer;" /> {{(scope.row.stepState.candidateAnnouncementCount4?scope.row.stepState.candidateAnnouncementCount4:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else style="line-height:30px"><i :class="'custom icon_c_5'" @click="doit(scope.row.unitId,11)" style="cursor: pointer;" /> {{(scope.row.stepState.candidateAnnouncementCount4?scope.row.stepState.candidateAnnouncementCount4:0)+'/'+scope.row.stepState.postReserveCount}}</div>
              </div>
              <div v-else style="line-height:30px"><i class="custom icon_c_0" /></div>
            </template>
          <!-- </el-table-column> -->
        </el-table-column>
        <el-table-column label="签订聘用合同，办理聘用手续">
          <el-table-column label="签订聘用合同" width="90" align="center">
            <template slot-scope="scope">
              <div v-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1&&scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1&&scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1">
                <div v-if="!scope.row.stepState.signContractCount1" style="line-height:30px"><i :class="'custom icon_c_0'"/> {{(scope.row.stepState.signContractCount1?scope.row.stepState.signContractCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="scope.row.stepState.postReserveCount<=scope.row.stepState.signContractCount1" style="line-height:30px"><i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,12)" style="cursor: pointer;" /> {{(scope.row.stepState.signContractCount1?scope.row.stepState.signContractCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else style="line-height:30px"><i :class="'custom icon_c_5'" @click="doit(scope.row.unitId,12)" style="cursor: pointer;" /> {{(scope.row.stepState.signContractCount1?scope.row.stepState.signContractCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
              </div>
              <div v-else style="line-height:30px"><i class="custom icon_c_0" /></div>
            </template>
          </el-table-column>
          <el-table-column label="落户备案" width="90" align="center">
            <template slot-scope="scope">
              <div v-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1&&scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1&&scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1">
                <div v-if="!scope.row.stepState.settlementRegistrationCount1" style="line-height:30px"><i :class="'custom icon_c_0'"/> {{(scope.row.stepState.settlementRegistrationCount1?scope.row.stepState.settlementRegistrationCount1:0)+'/'+scope.row.stepState.postReserveCount2}}</div>
                <div v-else-if="scope.row.stepState.postReserveCount2<=scope.row.stepState.settlementRegistrationCount1" style="line-height:30px"><i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,13)" style="cursor: pointer;" /> {{(scope.row.stepState.settlementRegistrationCount1?scope.row.stepState.settlementRegistrationCount1:0)+'/'+scope.row.stepState.postReserveCount2}}</div>
                <div v-else style="line-height:30px"><i :class="'custom icon_c_5'" @click="doit(scope.row.unitId,13)" style="cursor: pointer;" /> {{(scope.row.stepState.settlementRegistrationCount1?scope.row.stepState.settlementRegistrationCount1:0)+'/'+scope.row.stepState.postReserveCount2}}</div>
              </div>
              <div v-else style="line-height:30px"><i class="custom icon_c_0" /></div>
            </template>
          </el-table-column>
          <el-table-column label="聘用人员备案" width="90" align="center">
            <template slot-scope="scope">
              <div v-if="scope.row.stepState.plan_release&&scope.row.stepState.plan_release.state===1&&scope.row.stepState.plan_declare&&scope.row.stepState.plan_declare.state===1&&scope.row.stepState.post_docking&&scope.row.stepState.post_docking.state===1">
                <div v-if="!scope.row.stepState.registrationCount1" style="line-height:30px"><i :class="'custom icon_c_0'"/> {{(scope.row.stepState.registrationCount1?scope.row.stepState.registrationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else-if="scope.row.stepState.postReserveCount<=scope.row.stepState.registrationCount1" style="line-height:30px"><i :class="'custom icon_c_2'" @click="doit(scope.row.unitId,14)" style="cursor: pointer;" /> {{(scope.row.stepState.registrationCount1?scope.row.stepState.registrationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
                <div v-else style="line-height:30px"><i :class="'custom icon_c_5'" @click="doit(scope.row.unitId,14)" style="cursor: pointer;" /> {{(scope.row.stepState.registrationCount1?scope.row.stepState.registrationCount1:0)+'/'+scope.row.stepState.postReserveCount}}</div>
              </div>
              <div v-else style="line-height:30px"><i class="custom icon_c_0" /></div>
            </template>
          </el-table-column>
        </el-table-column>
      </el-table>
      <div class="block" style="background:#F5F7FA;overflow:hidden">
        <!-- <el-pagination :total="totalnum" :page-size="pageSize" @current-change="handleCurrentChange" :current-page="pageNum" @size-change="handleSizeChange" :page-sizes="[10, 20, 30, 50]" layout="total, sizes, prev, pager, next, jumper"></el-pagination> -->
        <div id="legent">
          <!-- <div><b>图例</b></div> -->
          <i class="custom icon_c_0"></i><div>未办理</div>
          <!-- <i class="custom icon_c_-1"></i><div>无需办理</div> -->
          <i class="custom icon_c_1"></i><div>待办理</div>
          <!-- <i class="custom icon_c_3"></i><div>已退回</div> -->
          <i class="custom icon_c_5"></i><div>部分完成</div>
          <i class="custom icon_c_2"></i><div>已完成</div>
        </div>
      </div>
    </section>
  </div>
</template>

<script>
export default {
  data () {
    return {
      unitBatchId: null,
      errorVisible: false,
      saveloading: false,
      errorList: [],
      yearLoading: false,
      theYear: '',
      yearList: [],
      title: '',
      type: '',
      typename: '',
      id: null,
      timestamp: '',
      selectStepVisible: false,
      changeType: '',
      substep: '',
      dongyipersonId: '',
      steppersonId: '',
      candidateReportpersonId: '',
      manageOpinionpersonId: '',
      necessarypersonId: '',
      tuijianpersonId: '',
      kaochapersonId: '',
      taolunpersonId: '',
      gongshipersonId: '',
      baobeipersonId: '',
      fawenpersonId: '',
      tanhuapersonId: '',
      tanhua2personId: '',
      xuanbupersonId: '',
      guidangpersonId: '',
      candidateReportdetailshow: false,
      manageOpiniondetailshow: false,
      necessarydetailshow: false,
      tuijiandetailshow: false,
      kaochadetailshow: false,
      taolundetailshow: false,
      gongshidetailshow: false,
      baobeidetailshow: false,
      fawendetailshow: false,
      tanhuadetailshow: false,
      tanhua2detailshow: false,
      xuanbudetailshow: false,
      guidangdetailshow: false,
      personId: '',
      dongyidetailshow: false,
      jdcchuzhang: '',
      chuzhangs: [],
      tasknum: '',
      filters: {
        status: 1,
        personName: '',
        unitName: '',
        year: null
      },
      selectionlist: [],
      totalnum: 0,
      pageNum: 1,
      pageSize: 20,
      listLoading: true,
      changeSizeFlag: false,
      unitName: '',
      necessaryItems: [],
      mangeDep: [],
      tableHeight: 100,
      userRoles: '',
      jdcuserlist: [],
      jdcsetting: [],
      jdc1: '',
      jdc2: '',
      jdc3: '',
      jdc4: '',
      username: ''
    }
  },
  methods: {
    setYear () {
      this.$router.push({name: 'recruitYearList'})
    },
    exportAll () {
      window.open(this.$http.defaults.baseURL + this.$http.defaults.recruitAPI + 'api/recruitBusAnnual/getExport?theYear=' + this.theYear)
    },
    downloadTemplate () {
      window.open(this.$http.defaults.baseURL + this.$http.defaults.recruitAPI + 'api/recruitBusPlanRelease/getTemplate')
    },
    uploadError (err) {
      this.saveloading = false
      console.log(err)
      this.$message({
        message: '上传失败:' + err,
        type: 'error'
      })
    },
    getImportList (res) {
      this.saveloading = false
      if (res.success) {
        if (res.result && res.result.length > 0) {
          this.errorList = res.result
          this.errorVisible = true
        } else {
          this.$message({
            message: '导入成功！',
            type: 'success'
          })
          this.getList()
        }
      } else {
        this.$message({
          message: '导入失败:' + res.message,
          type: 'error'
        })
      }
    },
    beforeAvatarUpload (file) {
      console.log('文件类型')
      console.log(file.name)
      const isFormat = file.name.indexOf('.xlsx') > 0
      // const isLt5M = file.size / 1024 / 1024 < 500
      if (!isFormat) {
        this.$message.error('上传文件只能是 .xlsx 格式!')
        return false
      }
      return isFormat
    },
    ftypename (type) {
      switch (type) {
        case 1:
          return '应届毕业生招聘'
        case 2:
          return '在职人员招聘'
        case 3:
          return '其他招聘'
      }
    },
    doit (id, step) {
      this.$router.push({name: 'recruitUnit', query: {step: step, unitId: id, theYear: this.theYear}})
    },
    inRoles (str) {
      console.log(str)
      let arr = this.userRoles
      // arr = 'aaabbROLE_admin'
      if (arr.indexOf(str) === -1) {
        return false
      } else {
        return true
      }
    },
    getList () {
      let para = {
        theYear: this.theYear,
        unitName: this.filters.unitName
      }
      this.listLoading = true
      this.$http
        .post(this.$http.defaults.recruitAPI + 'api/recruitBusUnit/getAllUnitsStepStates', para)
        .then(response => {
          this.listLoading = false
          this.selectionlist = response.data.result
        })
        .catch(error => {
          this.$message({
            message: '获取失败:' + error,
            type: 'error'
          })
          this.listLoading = false
        })
    },
    getYear () {
      this.yearLoading = true
      this.$http
        .get(this.$http.defaults.recruitAPI + `api/recruitBusAnnual/queryList`)
        .then(response => {
          if (response.data.result && response.data.result.length > 0) {
            this.yearLoading = false
            this.yearList = response.data.result.map(item => item.theYear)
            let objYear = response.data.result.find(item => item.isCurrent)
            if (this.$route.query.theYear) {
              this.theYear = parseInt(this.$route.query.theYear)
            } else {
              if (objYear) {
                this.theYear = objYear.theYear
              } else {
                this.theYear = response.data.result[0].theYear
              }
            }
            this.getList()
          } else {
            this.$message({
              message: '未设置招聘年度，请先设置招聘年度',
              type: 'error'
            })
            this.setYear()
          }
        })
        .catch(error => {
          this.$message({
            message: '获取失败:' + error,
            type: 'error'
          })
          this.yearLoading = false
        })
    },
    tableresize (obj) {
      var clientHeight = 0
      if (document.body.clientHeight && document.documentElement.clientHeight) {
        clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      } else {
        clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      }
      obj.$nextTick(function () {
        obj.tableHeight = clientHeight - 292
      })
    }
  },
  mounted () {
    this.id = 20
    this.getYear()
    this.tableresize(this)
    let _this = this
    window.onresize = function windowResize () {
      // 通过捕获系统的onresize事件触发我们需要执行的事件
      _this.tableresize(_this)
    }
  }
}
</script>
<style>
.selectioncontent{
  border-bottom:1px solid #333;
  padding:5px !important;
}
  .pointtab .el-badge__content.is-fixed{
    right: -5px;
    top:18px;
  }
  .pointtab{
    padding-right:22px;
  }
  .pointRadio .el-badge__content.is-fixed{
    right: -5px;
    top:6px;
  }
  .pointRadio .el-radio-button__inner{
    height:40px;
    padding-left:15px;
    padding-right:42px;
  }
#recruitlist .el-table--border td, .el-table--border th, .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed{
  border-bottom:1px solid #95B8E7;
}
#recruitlist .el-table td, #recruitlist .el-table th.is-leaf{
  border-right:1px solid #95B8E7;
}
  .wboxd .el-table th{
    font-weight: normal;
    background-image: linear-gradient(to bottom , #f8f8f8, #efefef);
    text-align: center;
    border-right: #95B8E7 solid 1px;
    border-bottom: #95B8E7 solid 1px;
    min-height: 30px;
    line-height:30px;
  }
  .wboxd .el-table td{
    padding:0;
    font-size:var(--size14) !important;
    line-height: 20px;
    font-family: '宋体',
  }
  .tableth{
    background-image: linear-gradient(to bottom , #f8f8f8, #efefef);
    height:33px;
  }
  #recruitlist .wboxs{
    height:45px;
    padding-top:10px;
  }
  #recruitlist .el-table__row{
    height: 50px;
  }
  #recruitlist #legent{
    float:right;
    margin-right: 20px;
  }
  #recruitlist #legent div{
    float:left;
    line-height: 42px;
    font-size:var(--size12);
  }
  #recruitlist #legent i{
    width: 30px;
    height: 30px;
    background-position: center center;
    background-repeat: no-repeat;
    float: left;
    display: block;
    margin:5px 0px 0 3px;
  }
  #recruitlist #selectionindexlist .cell i.custom{
    width: 30px;
    height: 30px;
    background-position: center center;
    background-repeat: no-repeat;
    float: left;
    display: block;
    margin:0 auto;
  }
  #recruitlist #selectionindexlist .cell button i{
    width: var(--size14);
    height: var(--size14);
  }
  #recruitlist .icon_c_0{
    background-image: url(../assets/icon_selection_index0.png)
  }
  #recruitlist .icon_c_1{
    background-image: url(../assets/icon_selection_index2.gif)
  }
  #recruitlist .icon_c_2{
    background-image: url(../assets/icon_selection_index1.png)
  }
  #recruitlist .icon_c_-1{
    background-image: url(../assets/icon_selection_index-1.png)
  }
  #recruitlist .icon_c_3{
    background-image: url(../assets/icon_selection_index3.png)
  }
  #recruitlist .icon_c_3a{
    background-image: url(../assets/icon_selection_index4t.png)
  }
  #recruitlist .icon_c_3b{
    background-image: url(../assets/icon_selection_index3b.png)
  }
  #recruitlist .icon_c_4{
    background-image: url(../assets/icon_selection_index4t.png)
  }
  #recruitlist .icon_c_5{
    background-image: url(../assets/icon_selection_index4r.png)
  }
  #recruitlist .icon_gd_0{
    background-image: url(../assets/icon_selection_gd0.png)
  }
  #recruitlist .icon_gd_1{
    background-image: url(../assets/icon_selection_gd1.gif)
  }
  #recruitlist .icon_gd_2{
    background-image: url(../assets/icon_selection_gd2.png)
  }
  #recruitlist .icon_gd_4{
    background-image: url(../assets/icon_selection_gd4.png)
  }
  #recruitlist .el-step__title.is-finish {
    color: #409EFF;
  }
  #recruitlist .el-step__title {
    font-size:12px;
    line-height: 22px;
    padding-left: 8px;
  }
  #recruitlist .el-steps{
    margin:10px 0;
  }
  .el-tooltip__popper.is-dark{
    font-size:var(--size18) !important;
  }
  .el-tabs--card>.el-tabs__header {
    border-bottom: 1px solid #9CA3B3;
  }
  .el-tabs--card>.el-tabs__header .el-tabs__nav {
    border: 1px solid #9CA3B3;
    border-bottom: 0;
  }
  .el-tabs--card>.el-tabs__header .el-tabs__item {
    border-left: 1px solid #9CA3B3;
    /* background-color: #F0F0F0; */
  }
  .el-tabs__item.is-active {
    color: #0000FF !important;
    font-weight: bolder !important;
    /* background-color: #fff !important; */
    /* border-bottom: 2px solid #9CA3B3 !important; */
  }
</style>
<style scoped>
  .el-tooltip__popper{
    font-size:var(--size) !important;
  }
  h1{
    font-size:var(--size16) !important;
    font-weight: bolder;
    height: 30px;
    border-bottom: 1px solid #95B8E7;
    font-family: '宋体';
    line-height: 30px;
    color: #000;
    padding-left:10px;
    background-image: linear-gradient(to bottom , #EEF4FF, #E0ECFF);
    margin:0;
  }
  .el-pagination{
    float: left;
    padding:7px 10px;
  }
  .wboxs{
    padding:5px 15px;
    width: calc(100% - 30px);
    background: #fff;
    border: 1px solid #95B8E7;
    margin:0 10px;
    overflow: hidden;
  }
  .wboxd{
    padding:0;
    width: calc(100% - 0px);
    background: #fff;
    border: 1px solid #95B8E7;
    margin:0 10px;
    overflow: hidden;
  }
</style>
